import 'package:flutter/material.dart';
import 'package:yysk_app/utils/helper.dart';
import 'package:yysk_app/utils/js_tool.dart';
import 'package:yysk_app/widget/button_widget.dart';

import '../widget/image_asset_widget.dart';

class UpgradeNoticeDialog extends StatelessWidget {
  final String title;
  final String btmTxt;
  final String content;
  final VoidCallback onUpgrade;
  final VoidCallback? onCancel;
  final bool isForceUpgrade;

  const UpgradeNoticeDialog({
    Key? key,
    required this.title,
    required this.content,
    required this.onUpgrade,
    required this.isForceUpgrade,
    this.btmTxt = '立即更新',
    this.onCancel,
  }) : super(key: key);

  static Future<void> show(
    BuildContext context, {
    required String title,
    required String content,
    required String btmTxt,
    required VoidCallback onUpgrade,
    required bool isForceUpgrade, //是否强制更新
    VoidCallback? onCancel,
  }) {
    return showDialog(
      context: context,
      barrierDismissible: false,
      builder:
          (_) => UpgradeNoticeDialog(
            title: title,
            content: content,
            onUpgrade: onUpgrade,
            onCancel: onCancel,
            isForceUpgrade: isForceUpgrade,
            btmTxt: btmTxt,
          ),
    );
  }

  @override
  Widget build(BuildContext context) {
    return PopScope(
      canPop: false,
      child:   Dialog(
      insetPadding: EdgeInsets.zero,
      backgroundColor: Colors.transparent,
      child: Column(
        mainAxisAlignment: MainAxisAlignment.center,
        children: [
          Stack(
            alignment: Alignment.topCenter,
            children: [
              Column(
                children: [
                  // hiSpace(height: 120.px),
                  ImageAssetWidget(
                    imageUrl: 'static/images/upgrade/upgrade_bg.png',
                    width: 375.px,
                    height: 615.px,
                  ),
                ],
              ),
              Column(
                children: [
                  hiSpace(height: 160.px),
                  TextImgWithGradient(
                    fontFamily: 'CustomFont',
                    startColor: Color(0xff284235),
                    endColor: Color(0xff3D6853),
                    text: title,
                    imWidth: 110.px,
                    imHeight: 22.px,
                    onPressed: () {},
                    fontSize: 22.px,
                  ),
                  hiSpace(height: 64.px),
                  Container(
                    padding: EdgeInsets.symmetric(horizontal: 55.px),
                    width: double.infinity,
                    height: 240.px,
                    child: Text(
                      content,
                      style: TextStyle(
                        fontSize: 20.px,
                        color: const Color(0xff444444),
                        fontWeight: FontWeight.w500,
                      ),
                    ),
                  ),
                  TextImgWithGradient(
                    fontFamily: 'CustomFont',
                    startColor: Color(0xff284235),
                    endColor: Color(0xff3D6853),
                    text: btmTxt,
                    imWidth: 156.px,
                    imHeight: 54.px,
                    imgUrl: 'static/images/upgrade/upgrade_button.png',
                    onPressed: () {
                      onUpgrade();
                    },
                    fontSize: 16.px,
                  ),
                ],
              ),
              Positioned(
                child: Container(
                  padding: EdgeInsets.only(right: 10.px, top: 105.px),
                  alignment: Alignment.topRight,
                  child: Visibility(
                    visible: !isForceUpgrade,
                    child: TextImgWithGradient(
                      fontFamily: 'CustomFont',
                      startColor: Color(0xff284235),
                      endColor: Color(0xff3D6853),
                      imgUrl: 'static/images/upgrade/upgrade_close.png',
                      imWidth: 29.px,
                      imHeight: 28.px,
                      onPressed: () {
                        if (onCancel != null) {
                          onCancel!();
                        }
                        Navigator.of(context).pop();
                      },
                      fontSize: 22.px,
                    ),
                  ),
                ),
              ),
            ],
          ),
        ],
      ),
    )
  );
  }
}

class TextImgWithGradient extends StatelessWidget {
  Color startColor, endColor;
  double fontSize;
  String text, fontFamily;
  String imgUrl;
  double imHeight; //图片宽高
  double imWidth; //图片宽高
  final VoidCallback? onPressed;
  TextImgWithGradient({
    Key? key,
    this.imgUrl = '',
    this.imHeight = 156,
    this.imWidth = 54,
    required this.onPressed,
    this.startColor = const Color(0xff000000),
    this.endColor = const Color(0xff000000),
    this.fontSize = 24,
    this.text = '',
    this.fontFamily = 'CustomFont',
  }) : super(key: key);

  @override
  Widget build(BuildContext context) {
    // 先用TextPainter测量文本宽高
    final tp = TextPainter(
      text: TextSpan(
        text: text,
        style: TextStyle(fontSize: fontSize, fontFamily: fontFamily),
      ),
      textDirection: TextDirection.ltr,
    )..layout();
    final width = tp.width;
    final height = tp.height;

    final Gradient gradient = LinearGradient(
      colors: [startColor, endColor],
      begin: Alignment.topCenter,
      end: Alignment.bottomCenter,
    );
    final Shader shader = gradient.createShader(
      Rect.fromLTWH(0, 0, width, height),
    );

    return GestureDetector(
      onTap: onPressed,
      child: Stack(
        alignment: Alignment.center,
        children: [
          imgUrl.isNotEmpty
              ? ImageAssetWidget(
                imageUrl: imgUrl,
                width: imWidth,
                height: imHeight,
              )
              : SizedBox(width: 0, height: 0),
          Column(
            children: [
              text.isNotEmpty
                  ? Text(
                    text,
                    style: TextStyle(
                      fontSize: fontSize,
                      fontFamily: fontFamily,
                      foreground: Paint()..shader = shader,
                    ),
                  )
                  : SizedBox(width: 0, height: 0),
            ],
          ),
        ],
      ),
    );
  }
}
